<style>
    .twoDiv{
        padding: 10px 0px;
        border-bottom: 1px solid #f6f6f6;
        color: #333;
        height: 60px;
    }
    .three{
        height: 500px;
        padding: 10px 0px;
    }
</style>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">零担外包</div>

                        <div class="layui-card-body">
                            <div class="twoDiv ">
                                <form class="layui-form layui-form-pane" action="#" lay-filter="example">
                                    <div class="layui-col-md3">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">运单号：</label>
                                            <div class="layui-inline">
                                                <input type="tel"  id="waybill_id" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-col-md3">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">到达分站：</label>
                                            <div class="layui-inline">
                                                <select name="substationunit" id="substationUnit" lay-verify="required">
                                                    <option value="请选择">请选择</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-col-md3">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">到达城市：</label>
                                            <div class="layui-inline">
                                                <input type="tel"  id="arrivalCity" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-col-md3">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">日期：</label>
                                            <div class="layui-inline">
                                                <input type="date"  id="consignDate" autocomplete="off" class="layui-input">
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div class="three" >
                                <table class="layui-hide" id="test" lay-filter="test"></table>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button  type="button" class="layui-btn layui-btn-sm" lay-event="getCheckData">运单搜索</button>
        <button type="button" class="layui-btn layui-btn-sm" lay-event="getCheckLength">其他外包登记</button>
    </div>
</script>
<script>
    layui.use(['table', 'form', 'jquery', 'layer', 'tree','util'], function () {
        var form = layui.form;
        table = layui.table;
        var $ = layui.jquery;

        form.render();

        $.ajax({
            url: "../../../../getAllSubstation",
            type: "post",
            data: {},
            dataType: "json",
            success: function (data) {
                //动态添加下拉框
                for (var i = 0; i < data.length; i++) {
                    $("#substationUnit").append("<option value='" + data[i].subId + "'>" + data[i].subName + "</option>");
                }
                //刷新
                form.render('select');
            }
        })

        //表格渲染
        table.render({
            elem: '#test'
            ,id:'two'
            ,height:500
            ,url:'../../../../XclBreakmajorityEpibolyControllerGetBreakmajorityEpibolyAll'
            ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
            ,title: '零担外包数据表'
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'waybill_id', title:'运单号', width:180, fixed: 'left', unresize: true, sort: true}
                ,{field:'consignDate', title:'托运日期', width:200, edit: 'text'}
                ,{field:'modeTransport', title:'运输方式', width:180, edit: 'text', sort: true}
                ,{field:'sub_name', title:'到达分站', width:100}
                ,{field:'arrivalCity', title:'到达城市' ,width:100}
                ,{field:'descriptionGoods', title:'货物名称', width:180, sort: true}
                ,{field:'quantity', title:'数量', width:120}
                ,{field:'weight', title:'重量', width:100, sort: true}
                ,{field:'volume', title:'体积', width:120}
                ,{field:'freightCollect', title:'到付', width:120}
                ,{field:'forwardingUnit', title:'发货单位', width:220}
                ,{field:'eeforwardingUnit', title:'收货单位', width:220}
                ,{field:'phone', title:'收货电话', width:120}
                ,{field:'site', title:'收货地址', width:260}
                ,{field:'remark', title:'备注', width:120}
            ]]
            ,page: true
        });




        //头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'getCheckData':
                    //执行重载
                    table.reload('two', {
                        page: {
                            curr: 1 //重新从第 1 页开始
                        }
                        //根据条件查询
                        ,where: {
                            waybill_id:$("#waybill_id").val(),
                            arrivalCity:$("#arrivalCity").val(),
                            consignDate:$("#consignDate").val(),
                            sub_id:$('#substationUnit option:selected').val(),
                            id:"1"
                        }
                    });
                    return false;
                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    if (data.length==0){
                        alert("请选中一行")
                    } else if (data.length>1) {
                        alert("只能选中一行进行操作")
                    }else {
                        layer.open({
                            type: 2,
                            title: '运输外包登记',
                            shadeClose: true,
                            shade: 0.8,
                            area: ['1000px', '600px'],
                            content: '/src/views/epiboly/iframe/addBreakmajorityEpiboly.html?id='+data[0].waybill_id //iframe的url
                        });
                    }
                    return false;
                    break;
            };
        });

    });
</script>


